<template>
    <view class="p_20 p_b_20 g_content">
        <view class="dis_f_l_c m_b_10">
            <u-tag v-if="userInfo.ifCardReview==2" text="待审核" type="warning" plain></u-tag>
            <u-tag v-if="userInfo.ifCardReview==3" text="审核通过" type="success" plain></u-tag>
        </view>
        <view class="card_box p_10 m_b_10"  v-if="userInfo.ifCardReview==4">
            <view style="display: flex">
                <u-tag text="审核未通过" type="error" plain></u-tag>
            </view>
            <view class="c_9 f_s_14 m_t_5">{{userInfo.reasonsReview}}</view>
        </view>
        <view class="card_box p_10">
            <u--form
                labelPosition="top"
                labelWidth="auto"
                ref="uForm"
                :model="formInfo"
                :rules="rules"
            >

                <u-form-item
                    label="身份"
                    prop="sf"
                    borderBottom
                    ref="item1"
                >
                    <u-radio-group v-model="formInfo.type">
                        <u-radio shape="circle" value="个人" name="1" label="个人" ></u-radio>
                        <view class="m_l_10">
                            <u-radio shape="circle" value="企业" name="2" label="企业" ></u-radio>
                        </view>
                    </u-radio-group>
                </u-form-item>
                <u-form-item
                    label="地址"
                    prop="city"
                    borderBottom
                    ref="item1"
                >
                    <uni-data-picker v-model="formInfo.city" :localdata="areaList" placeholder="请选择地区" popup-title="请选择地区" @change="onchange"  ></uni-data-picker>
                </u-form-item>
                <view v-if="formInfo.type=='1'">
                    <u-form-item
                        label="姓名"
                        ref="item1"
                        prop="sfzXm"
                    >
                        <u--input  v-model="formInfo.sfzXm" placeholder="请输入"></u--input>
                    </u-form-item>
                    <u-form-item
                        label="身份证号"
                        ref="item1"
                        prop="sfzHm"
                    >
                        <u--input  v-model="formInfo.sfzHm" placeholder="请输入"></u--input>
                    </u-form-item>
                    <u-form-item
                        label="请上传身份证人像面"
                        ref="item1"
                    >
                        <u-upload
                            :fileList="fileList1"
                            @afterRead="afterRead"
                            @delete="deletePic"
                            name="1"
                            multiple
                            :maxCount="1"
                            width="250"
                            height="150"
                        >
                            <image src="@/static/img/zheng.png" mode="widthFix" style="width: 300rpx;height: 200rpx;"></image>
                        </u-upload>
                    </u-form-item>
                    <u-form-item
                        label="请上传身份证国徽面"
                        ref="item1"
                    >
                        <u-upload
                            :fileList="fileList2"
                            @afterRead="afterRead"
                            @delete="deletePic"
                            name="2"
                            multiple
                            :maxCount="1"
                            width="250"
                            height="150"
                        >
                            <image src="@/static/img/fan.png" mode="widthFix" style="width: 300rpx;height: 200rpx;"></image>
                        </u-upload>
                    </u-form-item>
                </view>
                <view v-if="formInfo.type=='2'">
                    <u-form-item
                        label="企业名称"
                        ref="item1"
                        prop="enterpriseName"
                    >
                        <u--input  v-model="formInfo.enterpriseName" placeholder="请输入"></u--input>
                    </u-form-item>
                    <u-form-item
                        label="联系方式"
                        ref="item1"
                        prop="enterprisePhone"
                    >
                        <u--input  v-model="formInfo.enterprisePhone" placeholder="请输入"></u--input>
                    </u-form-item>
                    <!--                <u-form-item-->
                    <!--                    label="行业类型"-->
                    <!--                    prop="lxNameEj"-->
                    <!--                    ref="item1"-->
                    <!--                >-->
                    <!--                  <uni-data-picker v-model="query.lxNameEj"  :localdata="pickerTypeList" placeholder="请选择行业类型" popup-title="请选择行业类型" @change="onTypeChange" ></uni-data-picker>-->
                    <!--                </u-form-item>-->
                    <u-form-item
                        label="请上传营业执照"
                        ref="item1"
                    >
                        <u-upload
                            :fileList="fileList3"
                            @afterRead="afterRead"
                            @delete="deletePic"
                            name="3"
                            multiple
                            :maxCount="1"
                        >
                        </u-upload>
                    </u-form-item>
                </view>
            </u--form>
        </view>
        <view class="m_t_50">
            <u-button type="primary" color="#27AC2F" shape="circle"  @click="handleSumbit">立即认证</u-button>
        </view>
        <!-- 授权弹窗 -->
        <s-auth-modal />
    </view>
</template>
<script>
import {baseUrl} from "@/sheep/request/baseUrl";
import {getAreaListApi, authenticationApi} from "@/sheep/api/index";
import { mapGetters, mapMutations } from "vuex";
export default {
    name: "realName",
    data() {
        return {
            fileList1:[],
            fileList2:[],
            fileList3:[],
            areaList:[],
            formInfo: {
                city: '',
                sfzHm: '',
                sfzXm: '',
                enterprisePhone: '',
                enterpriseName: '',
                ifCardReview:2
            },
            rules: {
                city: {
                    type: 'string',
                    required: true,
                    message: '请选择地址',
                    trigger: ['blur', 'change']
                },
                sfzXm: {
                    type: 'string',
                    required: true,
                    message: '请填写姓名',
                    trigger: ['blur', 'change']
                },
                sfzHm: {
                    type: 'string',
                    required: true,
                    message: '请填写身份证号码',
                    trigger: ['blur', 'change']
                },
                enterpriseName: {
                    type: 'string',
                    required: true,
                    message: '请填写企业名称',
                    trigger: ['blur', 'change']
                },
                enterprisePhone: {
                    type: 'string',
                    required: true,
                    message: '请填写联系方式',
                    trigger: ['blur', 'change']
                },
            },
        }
    },
    computed: {
        ...mapGetters(["userInfo"]),
    },
    onLoad(params) {
        this.getArea()
    },
    methods:{
        getArea(){
            getAreaListApi().then(res=>{
                this.areaList = res.data
            })
        },
        onchange(e) {
            const value = e.detail.value
            if (value.length>0){
                this.formInfo.city= value[1].text
            }else{
                this.formInfo.city = ''
            }
        },
        handleSumbit(){
            console.log("this.formInfo.type", this.formInfo.type);
            this.$refs.uForm.validate().then(res=>{
                if (!this.formInfo.type){
                    uni.showToast({
                        title: '请选择认证类型',
                        icon: 'none'
                    })
                    return
                }
                if (this.formInfo.type==1){
                    if (this.fileList1.length == 0) {
                        uni.showToast({
                            title: '请上传身份证人像面',
                            icon: 'none'
                        })
                        return
                    }
                    if (this.fileList2.length == 0) {
                        uni.showToast({
                            title: '请上传身份证国徽面',
                            icon: 'none'
                        })
                        return
                    }
                }
                if (this.formInfo.type==2){
                    if (this.fileList3.length == 0) {
                        uni.showToast({
                            title: '请上传营业执照',
                            icon: 'none'
                        })
                        return
                    }
                }
                let that = this

                if (Array.isArray(this.fileList1)) {
                    if (this.fileList1.length > 0) {
                        this.fileList1.forEach((item, index) => {
                            if (index === 0) {
                                that.formInfo.idCardId = item.ossId;
                            } else {
                                that.formInfo.idCardId = that.formInfo.idCardId + "," + item.ossId;
                            }
                        });
                    } else {
                        that.formInfo.idCardId = "";
                    }
                }
                if (Array.isArray(this.fileList2)) {
                    if (this.fileList2.length > 0) {
                        this.fileList2.forEach((item, index) => {
                            if (index === 0) {
                                that.formInfo.idCardNegativeId = item.ossId;
                            } else {
                                that.formInfo.idCardNegativeId = that.formInfo.idCardNegativeId + "," + item.ossId;
                            }
                        });
                    } else {
                        that.formInfo.idCardNegativeId = "";
                    }
                }
                if (Array.isArray(this.fileList3)) {
                    if (this.fileList3.length > 0) {
                        this.fileList3.forEach((item, index) => {
                            if (index === 0) {
                                that.formInfo.businessLicense = item.ossId;
                            } else {
                                that.formInfo.businessLicense = that.formInfo.businessLicense + "," + item.ossId;
                            }
                        });
                    } else {
                        that.idCardNegativeId = "";
                    }
                }
                this.formInfo.userId = this.formInfo.userId;
                authenticationApi(this.formInfo).then(res=>{
                    uni.showToast({
                        title: res.msg,
                        icon: 'none'
                    })
                })
            })
        },
        // 上传图片
        async afterRead(event) {
            let lists = [].concat(event.file);
            console.log("lists", lists);
            let fileListLen = this[`fileList${event.name}`].length;
            lists.map((item, index) => {
                this[`fileList${event.name}`].push({
                    ...item,
                    status: "uploading",
                    message: "上传中",
                });
            });
            for (let i = 0; i < lists.length; i++) {
                const result = await this.uploadFilePromise(lists[i].url, lists, event);
                console.log("result", result);
                let item = this[`fileList${event.name}`][fileListLen];
                this[`fileList${event.name}`].splice(
                    fileListLen,
                    1,
                    Object.assign(item, {
                        status: "success",
                        message: "",
                        url: result.url,
                        name: result.fileName,
                        ossId: result.ossId
                    })
                );
                fileListLen++;
            }
        },
        uploadFilePromise(url, lists, event) {
            let token = uni.getStorageSync('token')
            let headerToken = "Bearer " + token
            return new Promise((resolve, reject) => {
                let a = uni.uploadFile({
                    url: baseUrl + "/resource/oss/upload",
                    filePath: url,
                    name: "file",
                    header: {
                        Authorization: headerToken,
                        clientId: "be7052a7e4f802c20df10a8d131adb12"
                    },
                    formData: {
                        user: "test",
                    },
                    success: (res) => {
                        let data = JSON.parse(res.data);
                        console.log("data", data);
                        if (data.code == 200) {
                            resolve(data.data);
                        } else {
                            if (lists.length > 0) {
                                lists.map((item, index) => {
                                    this[`fileList${event.name}`].splice(index, 1)
                                });
                            }
                            uni.showToast({
                                title: data.msg,
                                icon: "none",
                            });
                        }
                    },
                });
            });
        },
        // 删除图片
        deletePic(event) {
            this[`fileList${event.name}`].splice(event.index, 1);
        },
    }

}
</script>


<style scoped lang="scss">

</style>
